<template>
	<view class="header row-between">
		<view class="arrow-left" @click="back">
			<image src="@/static/arrow-left.png" mode="widthFix"></image>
		</view>
		<view class="title flex1 center">{{ title }}</view>
		<view class="arrow-left"></view>
	</view>
</template>

<script setup>
const props = defineProps({
	title: {
		type: String,
		default: ''
	}
});

function back() {
	uni.navigateBack({ delta: 1 });
}
</script>

<style lang="scss" scoped>
.header {
	padding: 5vw;
	flex-direction: row;

	.arrow-left {
		width: 12vw;
		height: 12vw;
		border-radius: 50%;

		image {
			width: 100%;
		}
	}

	.title {
		font-weight: bold;
		font-size: 5vw;
		color: #000000;
		text-align: center;
	}
}
</style>
